<template>
	<view>
	<uni-nav-bar
			statusBar="true" 
			:fixed="true" 
			:border="false" 
			bgcolor="#dddddd"
			backgroundColor="#ffffff">
				<view class="nav-bar-title" slot="middle">
					<view>
						{{i18n.Find}}
					</view>
				</view>
			</uni-nav-bar>
			<view class="nav-list">
				<view class="nav-item" @tap.stop="balances">
					<image src="../../static/miner/0.png" mode="widthFix" lazy-load></image>
					<view>{{i18n.Mining_pool}}</view>
				</view>
				<view class="nav-item" @tap.stop="jumpWebUrl('/pages/service/services')">
					<image src="../../static/miner/1.png" mode="widthFix" lazy-load></image>
					<view>{{i18n.Node_application}}</view>
				</view>
				<view class="nav-item" @tap.stop="ruble">
					<image src="../../static/miner/2.png" mode="widthFix" lazy-load></image>
					<view>{{i18n.Cloud_computing_power}}</view>
				</view>
				<view class="nav-item" @tap.stop="webjup('https://uniswap.consenlabs.com/?locale=zh-CN&utm_source=imtoken#/swap')">
					<image src="../../static/miner/3.png" mode="widthFix" lazy-load></image>
					<view>uniswap</view>
				</view>
				<view class="nav-item" @tap.stop="webjup('https://cn.etherscan.com')">
					<image src="../../static/miner/4.png" mode="widthFix" lazy-load></image>
					<view>{{i18n.Mainnet_mapping}}</view>
				</view>
			</view>
			<view class="fund-banner">
				<!-- <image :src="imhgurl" mode="widthFix" lazy-load></image> -->
				<bw-swiper :swiperList="bannerList" :autoplay="true" textStyleBottom="10" :textTip="true" @clickItem="choiseItem"></bw-swiper>
			</view>
			<view class="fund-content">
				<view class="fund-title">
					{{i18n.Main_promotion}}
				</view>
				<view class="fund-li">
					<view class="fund-li-content">
						<view class="fund-li-l">
							<view class="">{{i18n.fund_tips0}}</view>
							<text>{{i18n.fund_tips1}}</text>
						</view>
						<button type="default" @tap.stop="getin">{{i18n.Join_now}}</button>
					</view>
					<image src="../../static/miner/6.png" mode="widthFix" lazy-load></image>
				</view>
				<view class="fund-li">
					<view class="fund-li-content">
						<view class="fund-li-l">
							<view class="">{{i18n.fund_tips0}}</view>
							<text>{{i18n.fund_tips1}}</text>
						</view>
						<button type="default" @tap.stop="balances">{{i18n.Join_now}}</button>
					</view>
					
					
					<image src="../../static/miner/7.png" mode="widthFix" lazy-load></image>
				</view>
				
			</view>
			
			
	</view>
</template>

<script>
	import Toast from '@/components/toast/toast.vue';
	import Load from '@/components/common/load.vue';
	import {fetch, _updataTabBar, showToast, pageto, forceUpdate} from '@/common/js/util.js';
	import {mapGetters, mapMutations} from 'vuex' 
	import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue';
	var imgs = require("../../static/miner/5.png");
	var imgs_en = require("../../static/miner/5_en.png");
	export default {
		data() {
			return {
				imhgurl:'',
				bannerList:[]
			}
		},
		onShow() {
			uni.setNavigationBarTitle({
				title:this.getLang==1?'理财':'Financial management'
			})
			_updataTabBar(this.getTextArr,this.getLangType)
			if(this.getLang==1){
				this.imhgurl=imgs
			}else{
				this.imhgurl=imgs_en
			}
			this.getLun()
			this.indexFunc()
		},
		onLoad(){
			
		},
		computed:{
			i18n() {
				return this.$t('message');
			},
			...mapGetters([
				'getRequestUrl',
				"getLoginInfo",
				'getTextArr',
				'getLangType',
				'getLang'
			])
		},
		components:{
			Toast,Load,uniNavBar
		},
		methods:{
			indexFunc(){
				let url = this.getRequestUrl + '/api/index/index';
				let data = {
					id:this.getLoginInfo.id,
					token:this.getLoginInfo.token
				}
				this.showLoad = true;
				fetch(url,data,'POST').then(res=>{
					this.showLoad = false;
					if(res.data.code == 1){
						
					}else if(res.data.code ==2){
						showToast(res.data.msg)
						uni.navigateTo({
							url:"/pages/new-login/new-login"
						})
					}else if(res.data.code ==3){
						showToast(res.data.msg)
						uni.navigateTo({
							url:"/pages/new-login/new-login"
						})
					}else{
						showToast(res.data.msg)
					}
				}).catch(err=>{
					this.showLoad = true;
				})
			},
			choiseItem(e){
				// console.log(e.id);
				uni.navigateTo({
					url:`/pages/fund/bullentin?id=${e.id}`
				})
			},
			getLun(){
					let _url = this.getRequestUrl + '/api/user/notice';
					let result = fetch(_url);
					this.showLoad = true;
					result.then(res=>{
						this.showLoad = false;
						if(res.data.code){
							this.bannerList = res.data.data
							this.bannerList.forEach((item,index)=>{
								this.bannerList[index].text = item.title
								this.bannerList[index].img = this.getRequestUrl+'/uploads/'+item.img
							})
						}
					}).catch(err=>{ 
						this.showLoad = false;
					})
				},
			jumpWebUrl(url){
				switch (url){
					case '/pages/service/services':
					uni.navigateTo({
						url:'/pages/service/services'
					})
						break;
					case 'invite':
					uni.navigateTo({
						url:'/pages/invite/invite'
					})
					break;
					default:
						break;
				}
			},
			ruble(){
				showToast(this.getLangType=='en'?'Not yet open...':'暂未开放...');
				return;
				uni.navigateTo({
					url:"/pages/mine/rule"
				})
			},
			webjup(url){
				
				// #ifdef APP-PLUS
				plus.runtime.openWeb(url)
				// #endif
			},
			balances(){
				uni.navigateTo({
					url:`/pages/balance/balance`
				})
			},
		getin(){
			uni.navigateTo({
				url:'/pages/game/index'
			})
		},
		indevoing(){
			showToast(this.getLang==1?'正在开发中...':'in development...')
		}
			
		}
	}
	
</script>
<style lang="scss" scoped>
	.nav-bar-title{
		padding-left:30upx;
		view{
			font-size:38upx;
			font-weight:bold;
			color:#000000;
		}
	}
	.nav-list{
		display: flex;
		// align-items: center;
		.nav-item{
			flex: 1;
			top: center;
			padding-top: 184rpx;
			position: relative;
			image{
				position: absolute;
				left: 50%;
				top: 0;
				transform: translateX(-50%);
				width: 175rpx;
				height: 184rpx;
			}
			view{
				text-align: center;
				font-size: 26rpx;
			}
		}
	}
	.fund-banner{
		width: 725rpx;
		margin: 12rpx auto 0;
	}
	.fund-content{
		padding:  40rpx 30rpx 0;
		.fund-title{
			font-size: 30rpx;
			color: #0C1020;
			font-weight: bold;
			margin-bottom: 40rpx;
		}
		.fund-li{
			width: 590rpx;
			height: 94rpx;
			position: relative;
			margin-bottom: 35rpx;
			padding-top: 206rpx;
			padding-left: 100rpx;
			image{
				position: absolute;
				left: 0;
				top:0;
				width: 690rpx;
				height: 300rpx;
				flex-shrink: 0;
				z-index: -1;
			}
			.fund-li-content{
				width: 530rpx;
				display: flex;
				align-items: cnter;
				justify-content: space-between;
				.fund-li-l{
					flex: 1;
					view{
						font-size: 30rpx;
						color: #FFFFFF;
					}
					text{
						color: #545758;
						font-size: 24rpx;
					}
				}
				button{
					width: 152rpx;
					height: 44rpx;
					left: 44rpx;
					border-radius: 22rpx;
					border: 1rpx solid #FFFFFF;
					color: #FFFFFF;
					background: transparent;
					padding: 0;
					line-height: 44rpx;
					font-size: 22rpx;
					text-align: center;
				}
			}
			
		}
	}
	
	
	
	
	
	
	
	
	
	
</style>